/**
 * Created by zzy on 2017/8/22.
 */
import React, {Component} from 'react';
import {
    Text,
    View,
    TouchableOpacity,
    Image,
    Dimensions,
    FlatList
} from 'react-native';
import Ionicons from 'react-native-vector-icons/Ionicons';
import ProductDetails from './ProductDetails';

const width=Dimensions.get('window').width;

export default class Brand extends Component{
    static navigationOptions = {
        title: '品牌',
    };
    constructor(props){
        super(props);
        this.productlist=[{},{},{},{}]
    }
    render(){
        return <View style={{flex:1,backgroundColor:'#f5f5f5'}}>
            <FlatList
                onRefresh={this._onRefresh.bind(this)}
                refreshing={false}
                onEndReachedThreshold={0.1}
                onEndReached={this._onEndReached.bind(this)}
                data={this.productlist}
                numColumns={2}
                keyExtractor={(item,index) => index}
                renderItem={({item}) => <ProductCell item={item} onPress={()=>{
                    this.props.navigation.navigate('ProductDetails')
                }}/>}
            />
            </View>
    }
    _onEndReached(){

    }
    _onRefresh(){

    }
}


class ProductCell extends Component{

    render(){
        //let {productName,showPrice,soldNumber,icon} = this.props.item;
        let {addToShoppingCart,onPress} = this.props;
        var icon='https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1503974854&di=525aafffad696b5d30d7e2417c39f585&imgtype=jpg&er=1&src=http%3A%2F%2Fbpic.ooopic.com%2F15%2F17%2F25%2F15172520-3ab777a93176c83a5eeaffb972759a4f-1.jpg';
        return <TouchableOpacity style={[{backgroundColor:'#f5f5f5',width:width/2,padding:1}]} onPress={()=>{
            onPress()
        }} activeOpacity={0.9}
        >
            <View style={{flexDirection:'column',backgroundColor:'white',height:180}}>
                <Image style={{width:width/2,height:110,resizeMode:'contain'}} source={{uri:icon}}/>
                <Text style={{fontWeight:'100',marginLeft:10,color:'black',fontSize:14}}>农夫山泉 天然水 19L</Text>
                <Text style={{color:'red',marginLeft:10,fontSize:13,marginTop:5}}>¥10.00</Text>
                <View style={{flexDirection:'row',justifyContent:'space-between',alignItems:'center'}}>
                    <Text style={{fontSize:12,color:'gray',marginLeft:10}}>已售666</Text>
                    <TouchableOpacity style={{marginRight:10}} onPress={()=>{
                    }}>
                        <Ionicons name="ios-cart-outline" size={24} color="red"/>
                    </TouchableOpacity>
                </View>

            </View>
        </TouchableOpacity>
    }
}